<template>
  <div class="app-container">
    <div class="info-title">
      <span>排查任务信息</span>
      <router-link to="/workbench/check/index" class="info-back">
        <el-button type="primary">返回列表</el-button>
      </router-link>
    </div>
    <el-row class="demo-radius" v-for="(item, index) in myCheckTaskInfo" :key="index">
      <el-col :span="10" class="check-info-left">
        <span>管控措施类型：{{ item.classifyName }}</span>
        <span>管控措施内容：{{ item.riskMeasureDesc }}</span>
        <span>隐患排查内容：{{ item.troubleshootContent }}</span>
      </el-col>
      <el-col :span="14">
        <el-form-item label="隐患排查情况:" label-width="140px" prop="dangerDesc">
          <el-input
            type="textarea"
            :rows="3"
            v-model="checkForm[index].checkDesc"
            placeholder="请输入隐患描述"
            maxlength="3000"
          />
        </el-form-item>
        <el-form-item label="隐患排查结果:" label-width="140px" prop="dangerDesc1">
          <el-switch
            v-model="checkForm[index].checkStatus"
            inactive-text="无隐患"
            inactive-value="0"
            active-text="有隐患"
            active-value="1"
            size="large"
            @change="changeStatus"
          />
        </el-form-item>
      </el-col>
    </el-row>
    <el-row class="check-footer">
      <el-button type="primary" @click="submitForm">提交排查任务</el-button>
    </el-row>

    <!--隐患分配人新增或者修改隐患整改清单对话框-->
    <el-dialog :title="title" v-model="open" width="80%" append-to-body>
      <el-form ref="formRef" :model="form" :rules="rules">
        <el-tabs
          v-model="activeTabName"
          type="card"
          class="demo-tabs"
          @tab-click="handleClick"
        >
          <el-tab-pane label="基本信息" name="1">
            <el-form-item
              label="分析对象/单元:"
              label-width="140"
              prop="riskAnalysisUnit"
            >
              <el-tree-select
                v-model="form.riskAnalysisUnit"
                :data="unitOptions"
                :props="{ value: 'id', label: 'label', children: 'children' }"
                placeholder="请选择风险分析单元"
                filterable
              >
                <template
                  class="custom-tree-node"
                  #default="{ node, data }"
                  :disabled="data.nodeLevel == '1'"
                >
                  <span>{{ node.label }}</span>
                </template>
              </el-tree-select>
            </el-form-item>
            <el-row :gutter="12">
              <el-col :span="12">
                <el-form-item label="隐患来源:" label-width="140" prop="dangerSrc">
                  <el-select
                    v-model="form.dangerSrc"
                    placeholder="请选择"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in hiddenCheckListTypeOptions"
                      :key="dict.hiddenListTypeId"
                      :label="dict.hiddenListTypeName"
                      :value="dict.hiddenListTypeId"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="隐患类别:" label-width="140" prop="hazardCategory">
                  <el-select
                    v-model="form.hazardCategory"
                    placeholder="请选择隐患类别"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in hazardCategoryOptions"
                      :key="dict.id"
                      :label="dict.label"
                      :value="dict.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-form-item label="隐患名称:" label-width="140px" prop="dangerName">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerName"
                placeholder="请输入隐患名称"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="隐患描述:" label-width="140px" prop="dangerDesc">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerDesc"
                placeholder="请输入隐患描述"
                maxlength="3000"
              />
            </el-form-item>
            <el-form-item label="现场图片:" label-width="140px" prop="dangerImg">
              <ul class="el-upload-list el-upload-list--picture-card">
                <li
                  class="el-upload-list__item is-ready"
                  v-for="(item, index) in dangerImgList"
                >
                  <img class="el-upload-list__item-thumbnail" :src="item" />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-delete"
                      @click="handleRemove(item, index)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </li>
              </ul>
              <el-upload
                :http-request="handleDangerImgUpload"
                v-model="form.dangerImg"
                :show-file-list="false"
                :before-upload="beforeUpload"
                :on-exceed="handleAlarm"
                list-type="picture-card"
                :limit="3"
              >
                <el-icon><Plus /></el-icon>
              </el-upload>
            </el-form-item>
            <el-form-item label="登记人员:" label-width="140px" prop="registrantId">
              <el-select
                v-model="form.registrantId"
                clearable
                filterable
                placeholder="请选择登记人员"
              >
                <el-option
                  v-for="dict in userOption"
                  :key="dict.id"
                  :label="dict.label"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="登记日期:" label-width="140px" prop="registTime">
              <el-date-picker
                v-model="form.registTime"
                value-format="YYYY-MM-DD HH:mm:ss"
                type="datetime"
                placeholder="请选择登记日期"
              ></el-date-picker>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="定级分配" name="2">
            <el-form-item label="原因分析:" label-width="140px" prop="dangerReason">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerReason"
                placeholder="请输入原因分析"
                maxlength="3000"
              />
            </el-form-item>
            <el-form-item label="隐患等级:" label-width="140px" prop="dangerType">
              <el-radio-group v-model="form.dangerType">
                <el-radio label="1" size="large" border>一般隐患</el-radio>
                <el-radio label="2" size="large" border>重大隐患</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="隐患类型:" label-width="140" prop="hazardDangerType">
              <el-select
                v-model="form.hazardDangerType"
                placeholder="请选择隐患类型"
                clearable
                style="width: 240px"
              >
                <el-option
                  v-for="dict in dangerTypeOptions"
                  :key="dict.hazardDangerTypeId"
                  :label="dict.hazardDangerTypeName"
                  :value="dict.hazardDangerTypeId"
                />
              </el-select>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="隐患整改" name="3">
            <el-form-item label="整改措施:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.controlMeasures"
                placeholder="请输入整改措施"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="资金来源:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.cost"
                placeholder="请输入资金来源"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="验收标准:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.acceptanceStandard"
                placeholder="请输入验收标准"
                maxlength="300"
              />
            </el-form-item>

            <el-form-item label="整改人员:" label-width="140px" required>
              <el-select
                v-model="form.liablePersonId"
                clearable
                filterable
                placeholder="请选择整改人员"
              >
                <el-option
                  v-for="dict in userOption"
                  :key="dict.id"
                  :label="dict.label"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="验收人员:" label-width="140px" required>
              <el-select
                v-model="form.checkAcceptPersonId"
                clearable
                filterable
                placeholder="请选择验收人员"
              >
                <el-option
                  v-for="dict in userOption"
                  :key="dict.id"
                  :label="dict.label"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="整改期限:" label-width="140px" required>
              <el-date-picker
                v-model="form.dangerManageDeadline"
                value-format="YYYY-MM-DD HH:mm:ss"
                type="datetime"
                placeholder="请选择登记日期"
              ></el-date-picker>
            </el-form-item>
            <el-form-item
              label="上传整改通知单:"
              label-width="140px"
              prop="noticeRectification"
            >
              <ul class="el-upload-list el-upload-list--picture-card">
                <li class="el-upload-list__item is-ready" v-if="form.noticeRectification">
                  <img
                    class="el-upload-list__item-thumbnail"
                    src="@/assets/common/common-pdf.png"
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePdfPreview()"
                    >
                      <el-icon><zoom-in /></el-icon>
                    </span>
                  </span>
                </li>
              </ul>
              <el-upload
                :http-request="handleNoticeUpload"
                v-model="form.noticeRectification"
                :show-file-list="false"
                :before-upload="beforeNoticeUpload"
                :on-exceed="handleNoticeAlarm"
                list-type="picture-card"
              >
                <el-icon><Plus /></el-icon>
                <template #tip>
                  <div class="el-upload__tip">仅支持上传pdf文件</div>
                </template>
              </el-upload>
            </el-form-item>
          </el-tab-pane>
        </el-tabs>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <div v-if="showSubmit" class="dialog-footer">
            <el-button @click="nextTab('up')">上一步</el-button>
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="cancel">取 消</el-button>
          </div>
          <div v-else class="dialog-footer">
            <el-button v-if="activeTabName !== '1'" @click="nextTab('up')"
              >上一步</el-button
            >
            <el-button type="primary" @click="nextTab('down')">下一步</el-button>
          </div>
        </div>
      </template>
    </el-dialog>

    <!--普通权限新增或者修改隐患整改清单对话框-->
    <el-dialog :title="title" v-model="openCommon" width="80%" append-to-body>
      <el-form ref="formRef" :model="form" :rules="rules">
        <el-tabs
          v-model="activeTabName"
          type="card"
          class="demo-tabs"
          @tab-click="handleClick"
        >
          <el-tab-pane label="基本信息" name="1">
            <el-form-item
              label="分析对象/单元:"
              label-width="140"
              prop="riskAnalysisUnit"
            >
              <el-tree-select
                v-model="form.riskAnalysisUnit"
                :data="unitOptions"
                :props="{ value: 'id', label: 'label', children: 'children' }"
                placeholder="请选择风险分析单元"
                filterable
              >
                <template
                  class="custom-tree-node"
                  #default="{ node, data }"
                  :disabled="data.nodeLevel == '1'"
                >
                  <span>{{ node.label }}</span>
                </template>
              </el-tree-select>
            </el-form-item>
            <el-row :gutter="12">
              <el-col :span="12">
                <el-form-item label="隐患来源:" label-width="140" prop="dangerSrc">
                  <el-select
                    v-model="form.dangerSrc"
                    placeholder="请选择"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in hiddenCheckListTypeOptions"
                      :key="dict.hiddenListTypeId"
                      :label="dict.hiddenListTypeName"
                      :value="dict.hiddenListTypeId"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="隐患类别:" label-width="140" prop="hazardCategory">
                  <el-select
                    v-model="form.hazardCategory"
                    placeholder="请选择隐患类别"
                    clearable
                    style="width: 240px"
                  >
                    <el-option
                      v-for="dict in hazardCategoryOptions"
                      :key="dict.id"
                      :label="dict.label"
                      :value="dict.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-form-item label="隐患名称:" label-width="140px" prop="dangerName">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerName"
                placeholder="请输入隐患名称"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="隐患描述:" label-width="140px" prop="dangerDesc">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerDesc"
                placeholder="请输入隐患描述"
                maxlength="3000"
              />
            </el-form-item>
            <el-form-item label="现场图片:" label-width="140px" prop="dangerImg">
              <ul class="el-upload-list el-upload-list--picture-card">
                <li
                  class="el-upload-list__item is-ready"
                  v-for="(item, index) in dangerImgList"
                >
                  <img class="el-upload-list__item-thumbnail" :src="item" />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-delete"
                      @click="handleRemove(item, index)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </li>
              </ul>
              <el-upload
                :http-request="handleDangerImgUpload"
                v-model="form.dangerImg"
                :show-file-list="false"
                :before-upload="beforeUpload"
                :on-exceed="handleAlarm"
                list-type="picture-card"
                :limit="3"
              >
                <el-icon><Plus /></el-icon>
              </el-upload>
            </el-form-item>
            <el-form-item label="登记人员:" label-width="140px" prop="registrantId">
              <el-select
                v-model="form.registrantId"
                clearable
                filterable
                placeholder="请选择登记人员"
              >
                <el-option
                  v-for="dict in userOption"
                  :key="dict.id"
                  :label="dict.label"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="登记日期:" label-width="140px" prop="registTime">
              <el-date-picker
                v-model="form.registTime"
                value-format="YYYY-MM-DD HH:mm:ss"
                type="datetime"
                placeholder="请选择登记日期"
              ></el-date-picker>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="定级分配" name="2">
            <el-form-item label="原因分析:" label-width="140px" prop="dangerReason">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.dangerReason"
                placeholder="请输入原因分析"
                maxlength="3000"
              />
            </el-form-item>
            <el-form-item label="隐患等级:" label-width="140px" prop="dangerType">
              <el-radio-group v-model="form.dangerType">
                <el-radio label="1" size="large" border>一般隐患</el-radio>
                <el-radio label="2" size="large" border>重大隐患</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="隐患类型:" label-width="140" prop="hazardDangerType">
              <el-select
                v-model="form.hazardDangerType"
                placeholder="请选择隐患类型"
                clearable
                style="width: 240px"
              >
                <el-option
                  v-for="dict in dangerTypeOptions"
                  :key="dict.hazardDangerTypeId"
                  :label="dict.hazardDangerTypeName"
                  :value="dict.hazardDangerTypeId"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="是否立即整改:" label-width="140" prop="dangerManageType">
              <el-switch
                v-model="form.dangerManageType"
                inactive-value="1"
                active-value="0"
                size="large"
              />
            </el-form-item>
            <el-form-item
              v-if="form.dangerManageType == '1'"
              label="隐患分配人:"
              label-width="140"
              prop="allocationId"
            >
              <el-select
                v-model="form.allocationId"
                placeholder="请选择隐患分配人"
                clearable
                style="width: 240px"
              >
                <el-option
                  v-for="dict in allocationOptions"
                  :key="dict.hiddenUserId"
                  :label="dict.userName"
                  :value="dict.hiddenUserId"
                />
              </el-select>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="整改材料" v-if="form.dangerManageType == '0'" name="3">
            <el-form-item label="整改措施:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.controlMeasures"
                placeholder="请输入整改措施"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="资金来源:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.cost"
                placeholder="请输入资金来源"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="验收标准:" label-width="140px">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.acceptanceStandard"
                placeholder="请输入验收标准"
                maxlength="300"
              />
            </el-form-item>
            <el-form-item label="验收人员:" label-width="140px" required>
              <el-select
                v-model="form.checkAcceptPersonId"
                clearable
                filterable
                placeholder="请选择验收人员"
              >
                <el-option
                  v-for="dict in userOption"
                  :key="dict.id"
                  :label="dict.label"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="整改备注:" label-width="140px" prop="liableComment">
              <el-input
                type="textarea"
                :rows="3"
                v-model="form.liableComment"
                placeholder="请输入整改备注"
                maxlength="3000"
              />
            </el-form-item>
            <el-form-item label="整改材料:" label-width="140px" prop="liableDesc">
              <ul class="el-upload-list el-upload-list--picture-card">
                <li
                  class="el-upload-list__item is-ready"
                  v-for="(item, index) in rectifyImgList"
                >
                  <img class="el-upload-list__item-thumbnail" :src="item" />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-delete"
                      @click="handleRectifyRemove(item, index)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </li>
              </ul>
              <el-upload
                :http-request="handleRectifyUpload"
                v-model="form.liableDesc"
                :show-file-list="false"
                :before-upload="beforeUpload"
                :on-exceed="handleAlarm"
                list-type="picture-card"
                :limit="3"
              >
                <el-icon><Plus /></el-icon>
              </el-upload>
            </el-form-item>
          </el-tab-pane>
        </el-tabs>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <div v-if="showCommonSubmit" class="dialog-footer">
            <el-button @click="nextCommonTab('up')">上一步</el-button>
            <el-button type="primary" @click="submitCommonForm">确 定</el-button>
            <el-button @click="cancelCommon">取 消</el-button>
          </div>
          <div v-else class="dialog-footer">
            <el-button v-if="activeTabName !== '1'" @click="nextCommonTab('up')">
              上一步
            </el-button>
            <el-button
              v-if="activeTabName != '3'"
              type="primary"
              @click="nextCommonTab('down')"
            >
              下一步
            </el-button>
          </div>
        </div>
      </template>
    </el-dialog>
    <!--预览PDF文件对话框-->
    <el-dialog :title="title" v-model="openPDF" width="60%" append-to-body>
      <PDFView :pdfUrl="form.noticeRectification" />
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="cancelPdfPreview">取 消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script setup name="MyHandleCheck">
import PDFView from "@/components/PDFPreview";
import { getMyWaitCheckTask, submitCheckTask } from "@/api/prevent/workbench/myCheck";

import {
  getAllocationPerssion,
  getAllocationOption,
} from "@/api/prevent/hidden/allocation";
import { getUnitTree } from "@/api/prevent/risk/unit";
import { listDangerType } from "@/api/prevent/hidden/dangerType";
import { listHiddenLevel } from "@/api/prevent/hidden/hiddenLevel";
import { listCheckListType } from "@/api/prevent/hidden/checkListType";
import { listDangerState } from "@/api/prevent/hidden/dangerState";
import { listDutyUser } from "@/api/prevent/hidden/dutyUser";
import { deptTreeSelect, userTreeSelect } from "@/api/system/user";
import { uploadFile } from "@/api/common/upload";
import { addHidden } from "@/api/prevent/hidden/hiddenProcess";
const unitOptions = ref([]); //风险分析单元选择项
const dangerTypeOptions = ref([]); //隐患类型选择选
const hiddenLevelOptions = ref([]); //隐患等级选择项
const hiddenCheckListTypeOptions = ref([]); //隐患排查清单类型选择项
const dangerStateOptions = ref([]); //隐患状态选择项
const allocationOptions = ref([]); //隐患分配人选择项
const deptOptions = ref([]);
const userOption = ref(); //登记人员
const myCheckTaskInfo = ref([]); //检查任务信息
const loading = ref(false);
const open = ref(false);
const openPDF = ref(false);
const openCommon = ref(false);
const title = ref("");
const activeTabName = ref("1");
const showSubmit = ref(false);
const showCommonSubmit = ref(false);
const dangerImgList = ref([]); //现场图片列表
const hasPermission = ref("2"); //是否具备隐患分配权限
const rectifyImgList = ref([]); //整改材料图片
const hazardCategoryOptions = ref([
  { id: "0", label: "其他隐患" },
  { id: "1", label: "主要负责人隐患" },
  { id: "2", label: "技术负责人隐患" },
  { id: "3", label: "操作负责人隐患" },
]);
const { proxy } = getCurrentInstance();
const route = useRoute();
const router = useRouter();
const data = reactive({
  checkForm: [],
  form: {},
  rules: {
    riskAnalysisUnit: [
      {
        required: true,
        message: "风险分析对象/单元必须选择",
        trigger: ["blur", "change"],
      },
    ],
    dangerSrc: [
      { required: true, message: "请选择隐患来源", trigger: ["blur", "change"] },
    ],
    dangerName: [
      { required: true, message: "请输入隐患名称", trigger: "blur" },
      {
        min: 5,
        max: 100,
        message: "隐患名称长度必须介于 5 和 100 之间",
        trigger: "blur",
      },
    ],
    dangerDesc: [
      { required: true, message: "请输入隐患描述", trigger: "blur" },
      {
        min: 5,
        max: 3000,
        message: "隐患描述长度必须介于 5 和 3000 之间",
        trigger: "blur",
      },
    ],
    registrantId: [
      { required: true, message: "请选择登记人员", trigger: ["blur", "change"] },
    ],
    registTime: [
      { required: true, message: "请选择登记时间", trigger: ["blur", "change"] },
    ],
    dangerType: [
      { required: true, message: "请选择隐患等级", trigger: ["blur", "change"] },
    ],
    hazardDangerType: [
      { required: true, message: "请选择隐患类型", trigger: ["blur", "change"] },
    ],
    hazardCategory: [
      { required: true, message: "请选择隐患类别", trigger: ["click", "change"] },
    ],
    liableDesc: [{ required: true, message: "请上传整改材料", trigger: "blur" }],
    liableComment: [{ required: true, message: "请填写整改备注", trigger: "blur" }],
    allocationId: [{ required: true, message: "隐患分配人必须选择", trigger: "blur" }],
  },
});
const { form, checkForm, rules } = toRefs(data);

(() => {
  const taskId = route.params && route.params.taskId;
  if (taskId) {
    loading.value = true;
    getMyWaitCheckTask(taskId).then((response) => {
      myCheckTaskInfo.value = response.data;
      loading.value = false;
      initForm();
    });
  }
})();
/** 初始化form表单 */
function initForm() {
  checkForm.value = [];
  myCheckTaskInfo.value.forEach((item) => {
    checkForm.value.push({
      taskId: item.taskId,
      taskContentId: item.taskContentId,
      checkStatus: "0",
      checkDesc: "",
    });
  });
}

/** 校验数据 */
function validateData() {
  let res = true;
  checkForm.value.forEach((item, index) => {
    if (
      checkForm.value[index].checkDesc == "" ||
      checkForm.value[index].checkDesc == undefined
    ) {
      proxy.$modal.msgError("请输入第" + (index + 1) + "项的排查情况");
      res = false;
    }
  });
  return res;
}

/**提交排查任务 */
function submitForm() {
  if (validateData()) {
    submitCheckTask(checkForm.value).then((response) => {
      proxy.$modal.msgSuccess("提交成功");
      router.push("/workbench/check/index");
    });
  }
}

/** 处理TAB切换 */
const handleClick = (tab, event) => {
  if (tab.props.name == "3") {
    showSubmit.value = true;
  } else {
    showSubmit.value = false;
  }
};

/** 对话框切换下一步 */
function nextTab(flag) {
  if (activeTabName.value == "1") {
    //proxy.$refs["eventRef"].validate(valid => {});
    activeTabName.value = "2";
  } else if (activeTabName.value == "2") {
    if (flag == "up") {
      activeTabName.value = "1";
    } else {
      activeTabName.value = "3";
      showSubmit.value = true;
    }
  } else {
    if (flag == "up") {
      activeTabName.value = "2";
      showSubmit.value = false;
    }
  }
}

watch(
  () => form.value.dangerManageType,
  (newVal, oldVal) => {
    if (newVal == "0") {
      if (activeTabName.value == "2") {
        showCommonSubmit.value = false;
      }
    }

    if (newVal == "1") {
      if (activeTabName.value == "2") {
        showCommonSubmit.value = true;
      }
    }
  }
);

watch(
  () => activeTabName.value,
  (newVal, oldVal) => {
    if (newVal == "2") {
      if (openCommon.value) {
        if (form.value.dangerManageType == "0") {
          showCommonSubmit.value = false;
        } else {
          showCommonSubmit.value = true;
        }
      } else {
        showSubmit.value = false;
      }
    } else if (newVal == "3") {
      if (openCommon.value) {
        showCommonSubmit.value = true;
      } else {
        showSubmit.value = true;
      }
    } else {
      if (openCommon.value) {
        showCommonSubmit.value = false;
      } else {
        showSubmit.value = false;
      }
    }
  }
);

/** 对话框切换下一步 */
function nextCommonTab(flag) {
  if (activeTabName.value == "1") {
    activeTabName.value = "2";
    showCommonSubmit.value = true;
  } else if (activeTabName.value == "2") {
    if (flag == "up") {
      activeTabName.value = "1";
      showCommonSubmit.value = false;
    } else {
      activeTabName.value = "3";
      showCommonSubmit.value = true;
    }
  } else {
    if (flag == "up") {
      activeTabName.value = "2";
      showCommonSubmit.value = false;
    }
  }
}

/** 获取人员数据列表 */
async function getUserList() {
  listDutyUser().then((response) => {
    userOption.value = response.data;
  });
}

/** 获取当前登录用户是否具备隐患分配权限 */
function getPermission() {
  getAllocationPerssion().then((res) => {
    hasPermission.value = res.data.hasPermission;
  });
}

/** 获取风险等级列表数据 */
function getRiskUnitList() {
  getUnitTree().then((response) => {
    unitOptions.value = response.data;
  });
}

/** 获取隐患类型选择项列表 */
async function getDangerTypeList() {
  listDangerType().then((response) => {
    dangerTypeOptions.value = response.data;
  });
}

/** 获取隐患等级选择项列表 */
async function getHiddenLevelList() {
  listHiddenLevel().then((response) => {
    hiddenLevelOptions.value = response.data;
  });
}

/** 获取隐患排查清单类型选择项列表 */
async function getHiddenCheckListTypeList() {
  listCheckListType().then((response) => {
    hiddenCheckListTypeOptions.value = response.data;
  });
}

/** 获取隐患状态选择项列表 */
async function getDangerStateList() {
  listDangerState().then((response) => {
    dangerStateOptions.value = response.data;
  });
}

/** 获取隐患分配人选择项 */
async function getAllocationOptions() {
  getAllocationOption().then((response) => {
    //console.log(response.data);
    allocationOptions.value = response.data;
  });
}

/** 查询部门下拉树结构 */
function getDeptTree() {
  deptTreeSelect().then((response) => {
    deptOptions.value = response.data;
  });
}

/** 重置表单 */
function reset() {
  form.value = {
    dangerManageType: false,
  };
  proxy.resetForm("formRef");
  activeTabName.value = "1";
}

/** 处理添加 */
function handleAdd() {
  title.value = "隐患上报";
  reset();
  if (hasPermission.value == "1") {
    open.value = true;
  } else {
    openCommon.value = true;
  }
  reset();
}

/** 取消按钮 */
function cancel() {
  open.value = false;
  reset();
}

/** 取消按钮普通权限提交 */
function cancelCommon() {
  openCommon.value = false;
  reset();
}

/** 验证隐患整改 */
function volidateRectify() {
  if (form.value.riskAnalysisUnit == "" || form.value.riskAnalysisUnit == undefined) {
    proxy.$modal.msgError("风险分析单元必须得选择");
    return false;
  }
  if (form.value.dangerSrc == "" || form.value.dangerSrc == undefined) {
    proxy.$modal.msgError("隐患来源必须得选择");
    return false;
  }
  if (form.value.hazardCategory == "" || form.value.hazardCategory == undefined) {
    proxy.$modal.msgError("隐患类别必须得选择");
    return false;
  }
  if (form.value.dangerName == "" || form.value.dangerName == undefined) {
    proxy.$modal.msgError("隐患名称必须得填写！");
    return false;
  }
  if (form.value.dangerDesc == "" || form.value.dangerDesc == undefined) {
    proxy.$modal.msgError("隐患描述必须得填写！");
    return false;
  }
  if (form.value.registrantId == "" || form.value.registrantId == undefined) {
    proxy.$modal.msgError("登记人员必须得选择！");
    return false;
  }
  if (form.value.registTime == "" || form.value.registTime == undefined) {
    proxy.$modal.msgError("登记时间必须得选择！");
    return false;
  }
  if (form.value.dangerType == "" || form.value.dangerType == undefined) {
    proxy.$modal.msgError("隐患等级必须得选择！");
    return false;
  }
  if (form.value.hazardDangerType == "" || form.value.hazardDangerType == undefined) {
    proxy.$modal.msgError("隐患类型必须得选择！");
    return false;
  }
  if (form.value.liablePersonId == "" || form.value.liablePersonId == undefined) {
    proxy.$modal.msgError("整改人员必须得选择");
    return false;
  }
  if (
    form.value.checkAcceptPersonId == "" ||
    form.value.checkAcceptPersonId == undefined
  ) {
    proxy.$modal.msgError("验收人员必须得选择");
    return false;
  }
  if (
    form.value.dangerManageDeadline == "" ||
    form.value.dangerManageDeadline == undefined
  ) {
    proxy.$modal.msgError("整改期限必须得选择");
    return false;
  }

  return true;
}

/** 隐患分配人提交 */
function submitRectifyForm() {
  if (!volidateRectify()) return; //验证隐患分配相关信息
  form.value.dangerImg = dangerImgList.value + "";
  form.value.dangerManageType = "1";
  //   console.log("创建提交的数据", form.value);
  //   return;
  addHidden(form.value).then((response) => {
    proxy.$modal.msgSuccess("新增成功");
    open.value = false;
    getDataList();
  });
}

/** 验证普通角色隐患提交 */
function validateCommonRectify() {
  if (form.value.riskAnalysisUnit == "" || form.value.riskAnalysisUnit == undefined) {
    proxy.$modal.msgError("风险分析单元必须得选择");
    return false;
  }
  if (form.value.dangerSrc == "" || form.value.dangerSrc == undefined) {
    proxy.$modal.msgError("隐患来源必须得选择");
    return false;
  }
  if (form.value.hazardCategory == "" || form.value.hazardCategory == undefined) {
    proxy.$modal.msgError("隐患类别必须得选择");
    return false;
  }
  if (form.value.dangerName == "" || form.value.dangerName == undefined) {
    proxy.$modal.msgError("隐患名称必须得填写！");
    return false;
  }
  if (form.value.dangerDesc == "" || form.value.dangerDesc == undefined) {
    proxy.$modal.msgError("隐患描述必须得填写！");
    return false;
  }
  if (form.value.registrantId == "" || form.value.registrantId == undefined) {
    proxy.$modal.msgError("登记人员必须得选择！");
    return false;
  }
  if (form.value.registTime == "" || form.value.registTime == undefined) {
    proxy.$modal.msgError("登记时间必须得选择！");
    return false;
  }
  if (form.value.dangerType == "" || form.value.dangerType == undefined) {
    proxy.$modal.msgError("隐患等级必须得选择！");
    return false;
  }
  if (form.value.hazardDangerType == "" || form.value.hazardDangerType == undefined) {
    proxy.$modal.msgError("隐患类型必须得选择！");
    return false;
  }
  //立即整改
  if (form.value.dangerManageType == "0") {
    if (
      form.value.checkAcceptPersonId == "" ||
      form.value.checkAcceptPersonId == undefined
    ) {
      proxy.$modal.msgError("验收人员必须得选择！");
      return false;
    }
    if (form.value.liableComment == "" || form.value.liableComment == undefined) {
      proxy.$modal.msgError("整改备注必须得填写！");
      return false;
    }
    if (form.value.liableDesc == "" || form.value.liableDesc == undefined) {
      proxy.$modal.msgError("整改材料必须上传！");
      return false;
    }
  } else {
    if (form.value.allocationId == "" || form.value.allocationId == undefined) {
      proxy.$modal.msgError("隐患分配人需要选择！");
      return false;
    }
  }
  return true;
}

/** 普通角色提交 */
function submitCommonForm() {
  if (!validateCommonRectify()) return; //验证隐患分配相关信息
  form.value.dangerImg = dangerImgList.value + "";
  //   console.log("普通权限创建提交的数据", form.value);
  //   return;
  addHidden(form.value).then((response) => {
    proxy.$modal.msgSuccess("上报隐患成功");
    open.value = false;
    getDataList();
  });
}

/** 处理现场额图片上传*/
function handleDangerImgUpload(userFile) {
  const formData = new FormData();
  formData.append("file", userFile.file);
  uploadFile(formData).then((response) => {
    form.value.dangerImg = response.data.urls;
    dangerImgList.value.push(response.data.urls);
  });
}

/** 现场图片上传前 */
function beforeUpload(file) {
  const isJPG = file.type === "image/jpeg";
  const isPNG = file.type === "image/png";
  const isLt2M = file.size / 1024 / 1024 < 2;

  if (!isJPG && !isPNG) {
    proxy.$modal.msgError("上传图片只能是 JPG或者PNG 格式!");
  }

  if (!isLt2M) {
    proxy.$modal.msgError("上传图片大小不能超过 2MB!");
  }
  return (isJPG || isPNG) && isLt2M;
}
/** 现场图片超限后提醒 */
function handleAlarm() {
  proxy.$modal.msgError("上传图片数目不能超过三张图片!");
}

/** 删除现场照片 */
function handleRemove(file, index) {
  dangerImgList.value.splice(index, 1);
}

/** 处理整改通知单上传前 */
function beforeNoticeUpload(file) {
  const isPDF = file.type === "application/pdf";
  const isLimit = file.size / 1024 / 1024 < 35;
  if (!isPDF) {
    proxy.$modal.msgError("上传文件只能是PDF格式!");
  }

  if (!isLimit) {
    proxy.$modal.msgError("上传文件大小不能超过 35MB!");
  }
  return isLimit && isPDF;
}

/** 整改通知单超限后提醒 */
function handleNoticeAlarm() {
  proxy.$modal.msgError("上传文件数目只能一个!");
}

/** 处理整改通知单上传 */
function handleNoticeUpload(userFile) {
  const formData = new FormData();
  formData.append("file", userFile.file);
  uploadFile(formData).then((response) => {
    form.value.noticeRectification = response.data.urls;
  });
}
/** 处理整改材料上传 */
function handleRectifyUpload(userFile) {
  const formData = new FormData();
  formData.append("file", userFile.file);
  uploadFile(formData).then((response) => {
    rectifyImgList.value.push(response.data.urls);
    form.value.liableDesc = rectifyImgList.value + "";
  });
}

/** 处理整改材料删除 */
function handleRectifyRemove() {
  rectifyImgList.value.splice(index, 1);
  form.value.liableDesc = rectifyImgList.value + "";
}

/** 预览PDF文件 */
function handlePdfPreview() {
  openPDF.value = true;
  title.value = "PDF预览";
}

/** 取消PDF预览 */
function cancelPdfPreview() {
  openPDF.value = false;
}

/**检查结果变化 */
function changeStatus(val) {
  if (val == 1) {
    handleAdd();
  }
}

/** 初始化应用 */
getRiskUnitList();
getDangerTypeList();
getHiddenLevelList();
getHiddenCheckListTypeList();
getDangerStateList();
getUserList();
getDeptTree();
getAllocationOptions();
getPermission();
</script>
<style scoped lang="scss">
.info-title {
  height: 48px;
  width: 100%;
  padding: 0 18px;
  border-radius: 5px;
  background-color: #f6f8fa;
  color: #2c2c2c;
  margin: -6px 0 15px 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  & .info-back {
    color: #0086ff;
  }
  & span {
    font-weight: 800;
  }
}
.demo-radius {
  width: 90%;
  border: 1px solid var(--el-border-color);
  border-radius: 5px;
  margin: 10px;
  padding: 10px;
}
.check-info-left {
  display: flex;
  flex-direction: column;
  height: 120px;
  & span {
    height: 40px;
    line-height: 40px;
    color: #9e9e9e;
    font-size: 12px;
  }
}
.check-footer {
  margin-top: 40px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
</style>
